<template>
	<view class="wrap">
		<form>
			<view class="form_item_h">
				<view class="h" style="width: 70%;">
					退房详情
				</view>
				<view style="width: 20%;text-align: end;color: #ff5a00;"
					:style="list.contractState==0?'color:#51aa37':list.contractState==1?'color:#51aa37':list.contractState==2?'color:#00c6ff':list.contractState==3?'color:#dae1de':list.contractState==4?'color:#ff6d00':''">
					{{list.contractState==0?'待支付':list.contractState==1?'执行中':list.contractState==2?'执行完毕':list.contractState==3?'解除':list.contractState==4?'退房中':''}}
				</view>
			</view>
			<!-- <view class="form_item">
				<view class="label">
					<text class="label_text">*</text><text>合同编号</text>
				</view>
				<view class="input">
					
				</view>
			</view> -->
			<view class="form_item">
				<view class="label">
					<text class="label_text"></text><text>门店名称</text>
				</view>
				<view class="input">
					{{list.deptName}}
				</view>
			</view>
			<view class="form_item">
				<view class="label">
					<text class="label_text"></text><text>房源号</text>
				</view>
				<view class="input">
					{{list.roomNum}}
				</view>
			</view>
			<view class="form_item">
				<view class="label">
					<text class="label_text"></text><text>申请方</text>
				</view>
				<view class="input">
					{{list.cardName}}
				</view>
			</view>
			<view class="form_item">
				<view class="label">
					<text class="label_text"></text><text>提出申请日期</text>
				</view>
				<view class="input">
					{{list.refundTime}}
				</view>
			</view>

			<!-- 	<view style="margin: 30rpx 0;">
				<uni-section title="纵向排列" type="line">
					<uni-steps :options="list2" active-color="#ff5a00" :active="active" direction="column" />
				</uni-section>
			</view> -->

			<!-- <button id="submit" @click="submit">提交保存</button> -->
			<view style="width: 100%;height: 20rpx;">
			</view>
		</form>
	</view>
</template>

<script module="utils" lang="wxs" src="../../utils/imgSrc.wxs"></script>

<script>
	import config from '../../config.js';

	import {
		throttle
	} from "@/utils/throttle.js"

	export default {
		data() {
			return {
				entityIndex: 0,
				list: [],
				refundId: '',

			};
		},
		methods: {
			init(item) {
				let data = {
					contractId: this.contractId
				}
				this.api.get('hetong/refund/app/selRefundAndContractAll', data).then(res => {
					if (res.data.code == 200) {
						this.list = res.data.data
					}
				})
			}
		},

		onLoad(option) {
			this.contractId = option.contractId
			if (option.contractId) {
				this.init(option.contractId)
			} else {
				uni.showToast({
					title: '加载失败，请稍后再试',
					icon: 'none',
					duration: 1500
				});
			}
		},
		onShow() {

		},
		onReady() {

		},
	};
</script>

<style lang="scss">
	.flex_most {
		width: 28rpx;
		height: 28rpx;
		margin-top: 5rpx;
	}

	.flex_logo {
		width: 28rpx;
		height: 28rpx;
		margin-top: 46rpx;
	}

	.logo {
		width: 80rpx;
		height: 80rpx;
		margin-top: 20rpx;
		margin-left: 310rpx;
	}

	.wrap {
		margin: 0 auto 54rpx;
		width: 718rpx;
	}

	.flex {
		display: flex;
		justify-content: flex-end;
	}

	.form_item_h {
		width: 718rpx;
		height: 40rpx;
		border-bottom: 1rpx solid #aaacba;
		display: flex;
		flex-wrap: nowrap;
		overflow: hidden;
		padding: 40rpx 0;
	}

	#submit {
		width: 660rpx;
		height: 112rpx;
		line-height: 112rpx;
		background: #ff6900;
		border-radius: 8rpx;
		text-align: center;
		font-size: 34rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #FFFFFF;
		margin-top: 30rpx;
	}

	.gray_h {
		width: auto;
		height: 40rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: #AAACAB;
		line-height: 40rpx;
		margin: 34rpx 0 44rpx 24rpx;
		box-sizing: border-box;
	}

	textarea {
		width: 564rpx;
		height: 190rpx;
		border: 2rpx solid #F7F4F4;
		margin: 0 auto;
		font-size: 28rpx;
		font-weight: 400;
		color: #AAACAB;
		padding: 24rpx 38rpx 14rpx 38rpx;
	}

	.placeholder_textarea {
		font-size: 28rpx;
		font-weight: 400;
		color: #AAACAB;

	}

	.h {
		height: 48rpx;
		font-size: 34rpx;
		font-weight: 400;
		color: #1A1A1A;
		line-height: 48rpx;
		margin-left: 44rpx;
	}

	form {
		width: 718rpx;

		.form_item_logo {
			width: 718rpx;
			height: 120rpx;
			border-bottom: 1rpx solid #F7F4F4;
			display: flex;
			justify-content: flex-start;
			flex-wrap: nowrap;
			overflow: hidden;

			.label {
				width: 40%;
				height: 120rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
				line-height: 120rpx;

				.label_text {
					color: red;
					margin-left: 28rpx;
					margin-top: 16rpx;
					margin-right: 10rpx;
				}
			}

			.font_size {
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
			}

			.input {
				width: 55%;
				height: 120rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: black;
				line-height: 120rpx;
				text-align: end;
			}

		}

		.uni-file-picker__container {
			display: flex;
			box-sizing: border-box;
			flex-wrap: wrap;
			margin: -5px;
			width: 660rpx;
			margin: 0 auto;
		}

		.from_file {
			width: 718rpx;
			height: 40rpx;
			border-bottom: 1rpx solid #F7F4F4;
			display: flex;
			justify-content: flex-start;
			flex-wrap: nowrap;
			overflow: hidden;
			padding: 40rpx 0 20rpx;

			.label {
				width: 40%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
				line-height: 40rpx;

				.label_text {
					color: red;
					margin-left: 28rpx;
					margin-top: 16rpx;
					margin-right: 10rpx;
				}
			}

			.input {
				width: 55%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: black;
				line-height: 40rpx;
				text-align: end;
			}

			.font_size {
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
			}

			input {
				width: 55%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: black;
				line-height: 40rpx;
				text-align: end;
			}
		}


		.form_item {
			width: 718rpx;
			height: 40rpx;
			border-bottom: 1rpx solid #F7F4F4;
			display: flex;
			justify-content: flex-start;
			flex-wrap: nowrap;
			overflow: hidden;
			padding: 40rpx 0;


			.label {
				width: 40%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
				line-height: 40rpx;

				.label_text {
					color: red;
					margin-left: 28rpx;
					margin-top: 16rpx;
					margin-right: 10rpx;
				}
			}

			.input {
				width: 55%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: black;
				line-height: 40rpx;
				text-align: end;
			}

			.font_size {
				font-size: 28rpx;
				font-weight: 400;
				color: #AAACAB;
			}

			input {
				width: 55%;
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: black;
				line-height: 40rpx;
				text-align: end;
			}
		}
	}
</style>